<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="static/easyui/themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css" href="static/easyui/themes/icon.css">
<link rel="stylesheet" href="static/css/style.css" />
<link rel="stylesheet" href="static/css/tcommon.css" />
<script src="static/jquery/jquery-1.12.4.js"></script>
<script src="static/easyui/jquery.easyui.min.js"></script>
<script src="static/easyui/locale/easyui-lang-zh_CN.js"></script>
<title>设备维保记录</title>
</head>

<body>
<div class="content-container" data-options="region:'center'">
<div class="panel-header"><div class="panel-title">设备维保记录列表</div></div>
		<table id="pro_table" class="easyui-datagrid" style="height: 100%">
		</table>
	
	<div id="pro_tb">
		<div>
			项目：
			<input style="width: 200px;" id="projectitemid" name="projectitemid" class="easyui-combobox" editable="false"
				data-options="
							    valueField: 'id',
							    textField: 'name',
							    url: 'projectitemlist.do?status=2',
							    onLoadSuccess : function(data){ 
							    	if(data.length>0){
							    		$('#projectitemid').combobox('setValue',data[0].id);
							    	}
							    },onSelect: function(rec){
							    	projectitemid = rec.id;
							    	loadData();
   									var url2='equipments.do?projectitemid='+rec.id;
   									$('#equipment').combobox('reload', url2);
							    },panelHeight: 'auto'">
		</div>
		<div>
		<a href="javascript:void(0)" class="d-btn btn-blue" onclick="newpro()">添加</a>
		<a href="javascript:void(0)" class="d-btn btn-green" onclick="updatepro()">编辑</a>
		<a href="javascript:void(0)" class="d-btn btn-red" data-options="iconCls:'icon-remove',plain:true" onclick="deletepro()">删除</a>
	
		</div>
		</div>
	</div>
	<div id="proDlg" class="easyui-dialog info_dialog"
		style="width: 600px; padding: 10px 20px; max-height: 600px; overflow-y: auto; top: 30px;" closed="true"
		buttons="#pro-dlg-buttons">
		<div class="title"></div>
		<form id="proFm" method="post">
			<div class="content_container">
				<table class="content_table">
					<tr>
						<td style="width: 150px;">设备名:</td>
						<td>
							<input style="width: 200px;" id="equipment" name="equipment" class="easyui-combobox" editable="false"
								data-options="valueField:'id',textField:'name',panelHeight: 'auto'">
						</td>
					</tr>
					<tr>
						<td style="width: 100px;">是否开机：</td>
						<td>
							<input class="easyui-checkbox" name="isopen" id="isopen">
						</td>
					</tr>
					<tr id="tr1" style="display: none;">
						<td style="width: 100px;">开机时间：</td>
						<td>
							<input class="easyui-datetimebox" id="starttime" name="starttime" style="width: 200px;" editable="false" />
						</td>
					</tr>
					<tr id="tr2" style="display: none;">
						<td style="width: 100px;">开机时长（小时）：</td>
						<td>
							<input class="easyui-textbox" id="intervaltime" name="intervaltime" style="width: 200px;" data-options="validType:'number'" />
						</td>
					</tr>
					<tr>
						<td style="width: 100px;">是否维保：</td>
						<td>
							<input class="easyui-checkbox" name="isdaily" id="isdaily">
						</td>
					</tr>
					<tr id="tr3" style="display: none;">
						<td style="width: 100px;">维保时间：</td>
						<td>
							<input class="easyui-datetimebox" id="createtime" name="createtime" style="width: 200px;" editable="false" />
						</td>
					</tr>
					<tr>
						<td style="width: 100px;">备注：</td>
						<td>
							<input class="easyui-textbox" id="remark" name="remark" style="width: 200px;" />
						</td>
					</tr>
					<tr>
						<td style="width: 100px;">上传附件：</td>
						<td>
							<input class="easyui-filebox" id="images" name="images" style="width: 300px;"
								data-options="prompt:'添加文件', buttonText:'选择文件',multiple:true,accept:''" />
						</td>
					</tr>
				</table>
			</div>
		</form>
	</div>
	<div id="pro-dlg-buttons">
		<a href="# " class="easyui-linkbutton " onclick="savePro()">保存</a>
		<a href="# " class="easyui-linkbutton btn-cancel " onclick="javascript:$('#proDlg').dialog('close')">关闭</a>
	</div>
	<div style="display: none">
		<div id="displayAtt" class="datagrid-toolbar" style="width: 80%; max-height: 80%; padding: 5px; top: 30px; text-align: center;">
		</div>
	</div>

</body>
<script>
	var currentPro;
	var projectitemid;

	$(document).ready(function() {
		$('#starttime').datetimebox({
			onSelect : function(date) {
				var time = $('#starttime').datetimebox('spinner')
						.spinner('getValue');
				$('#starttime').datetimebox(
						'setText',
						date.getFullYear() + '-'
								+ (date.getMonth() + 1) + '-'
								+ date.getDate() + ' ' + time);
				$('#starttime').datetimebox('hidePanel');
			}
		});
		$('#createtime').datetimebox({
			onSelect : function(date) {
				var time = $('#createtime').datetimebox('spinner')
						.spinner('getValue');
				$('#createtime').datetimebox(
						'setText',
						date.getFullYear() + '-'
								+ (date.getMonth() + 1) + '-'
								+ date.getDate() + ' ' + time);
				$('#createtime').datetimebox('hidePanel');
			}
		});
		$('#isopen').checkbox({
			onChange : function(r) {
				if (r){
					document.getElementById("tr1").style.display = "";
					document.getElementById("tr2").style.display = "";
				}else{
					document.getElementById("tr1").style.display = "none";
					document.getElementById("tr2").style.display = "none";
				}
			}
		})
		$('#isdaily').checkbox({
			onChange : function(r) {
				if (r){
					document.getElementById("tr3").style.display = "";
				}else{
					document.getElementById("tr3").style.display = "none";
				}
			}
		})
	})
	function loadData() {
		$('#pro_table').datagrid({
			rownumbers : true,
			singleSelect : true,
			pagination : true,
			fitColumns : false,
			border : false,
			striped : true,
			toolbar : '#pro_tb',
			url : "equipmentMarkList",
			method : 'get',
			queryParams : {
				projectitemid : projectitemid
			},
			onSelect : function(index,row) {
				currentPro = row;
			},
			onDblClickRow : function(index,row) {
				currentPro = row;
				updatepro();
			},
			columns : [ [ {
				field : 'equipmentid',
				title : '设备名',
				width : '',
				formatter : function(value,row,index) {
					if (row.equipment){
						return row.equipment.name;
					}
				}
			},{
				field : 'starttime',
				title : '开机时间',
				width : '',
				formatter : function(value,row,index) {
					if (value){
						return formatDate(value);
					}
				}
			},{
				field : 'intervaltime',
				title : '开机时长(小时)',
				width : ''
			},{
				field : 'isdaily',
				title : '是否维保',
				width : '',
				formatter : function(value,row,index) {
					if (value == 1){
						return "是";
					}else{
						return "否";
					}
				}
			},{
				field : 'createtime',
				title : '维保时间',
				width : '',
				formatter : function(value,row,index) {
					if (value){
						return formatDate(value);
					}
				}
			},{
				field : 'remark',
				title : '备注',
				width : ''
			},{
				field : 'attachment',
				title : '附件',
				width : '',
				formatter : function(value,row,index) {
					if (row.status == 6){
						if (row.attachments.length > 0){
							return '<a href="#" style="color:red;" onclick="displayAtt(' + index + ');">点击查看</a>';
						}else{
							return '';
						}
					}else{
						if (row.attachments.length > 0){
							return '<a href="#" style="color:red;" onclick="viewAtt(' + index + ');">点击查看</a>';
						}else{
							return '';
						}
					}
				}
			} ] ]
		});
	}
	function refreshProTable() {
		$('#pro_table').datagrid("load", {
			projectitemid : projectitemid
		});
	}
	function newpro() {
		$("#proDlg").dialog('open').dialog('setTitle', '添加设备维保记录');
		$("#proFm").form('clear');
		currentPro = {};
	}
	function updatepro() {
		$("#proFm").form('clear');
		currentPro = $("#pro_table").datagrid('getSelected');
		if (currentPro){
			$("#equipment").combobox("setValue", currentPro.equipment.id);
			$("#proFm").form('load', {
				remark : currentPro.remark
			});
			if (currentPro.starttime != null){
				$("#isopen").checkbox('check');
				$("#starttime").datetimebox("setValue", parsedate(currentPro.starttime));
				$("#intervaltime").textbox("setValue", currentPro.intervaltime);
			}
			if (currentPro.isdaily == 1){
				$("#isdaily").checkbox('check');
				$("#createtime").datetimebox("setValue", parsedate(currentPro.createtime));
			}
			$("#proDlg").dialog('open').dialog('setTitle', '更新设备维保记录');
		}else{
			$.messager.alert('更新', '请选择要更新的设备维保记录', 'warning');
		}
	}
	function deletepro() {
		currentPro = $("#pro_table").datagrid('getSelected');
		if (currentPro){
			$.messager.confirm("操作提示", "您确定要执行操作吗？", function(data) {
				if (data){
					$.ajax({
						type : 'POST',
						url : "equipmentMarkDelete.do?id=" + currentPro.id,
						contentType : "application/json",
						success : function(data) {
							if (data.success){
								$.messager.show({
									title : '删除',
									msg : '删除成功',
									timeout : 5000,
									showType : 'slide'
								});
								refreshProTable();
							}else{
								$.messager.alert('删除', '删除失败', 'error');
							}
						},
						dataType : "json"
					});
				}else{
				}
			});
		}else{
			$.messager.alert('更新', '请选择要删除的设备维保记录', 'warning');
		}
	}
	function savePro() {
		if (!$("#proFm").form('validate'))
			return;
		var formData = new FormData();
		if (currentPro.id){
			formData.append("id", currentPro.id);
		}
		formData.append("equipmentid", $("#equipment").combobox('getValue'));
		formData.append("starttime", $("#starttime").datetimebox('getValue'));
		formData.append("intervaltime", $("#intervaltime").textbox('getValue'));
		formData.append("remark", $("#remark").textbox('getValue'));
		if (document.getElementById("_easyui_checkbox_5").checked){
			formData.append("isdaily", 1);
		}else{
			formData.append("isdaily", 2);
		}
		formData.append("createtime", $("#createtime").datetimebox('getValue'));
		var images = document.getElementById("filebox_file_id_1").files;
		for(var i = 0;i < images.length;i++){
			formData.append('images', images[i]);
		}
		$.ajax({
			type : 'POST',
			url : "equipmentMarkSave.do",
			cache : false,
			data : formData,
			processData : false,
			contentType : false,
			success : function(data) {
				if (data.success){
					$.messager.show({
						title : '保存设备维保记录',
						msg : '保存设备维保记录成功',
						timeout : 5000,
						showType : 'slide'
					});
					refreshProTable();
				}else{
					$.messager.alert('保存设备维保记录', '保存设备维保记录失败', 'error');
				}
				$('#proDlg').dialog('close');
			},
			dataType : "json"
		});
	}
	function displayAtt(index) {
		var row = $('#pro_table').datagrid('getRows')[index];
		var tb = "";
		$.each(row.attachments,function(i,val) {
			tb += '<div id="att'+val.id+'" class="col-md-3" ><a onclick="window.open(\''
					+ val.url
					+ '\',\'_blank\', \' toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no\');" style="width:100px;height:100px;" alt="查看全图"><br>';
			tb += '<span>' + val.name + '</span><br>';
			tb += '<a href="javascript:void(0)" class="easyui-linkbutton l-btn l-btn-small" style="margin-right:5px;" onclick="attachmentFile('
					+ val.id
					+ ',\''
					+ val.name
					+ '\')"><span class="l-btn-text">下载</span></a>';
			tb += '<a href="javascript:void(0)" class="easyui-linkbutton l-btn l-btn-small" onclick="remove('
					+ val.id
					+ ')" ><span class="l-btn-text">删除</span></a>';
			tb += '</div>';
		});
		$('#displayAtt').empty().html(tb);
		$('#displayAtt').dialog({
			title : '附件',
			resizable : true,
			closed : false,
			cache : false,
			modal : true
		});
	}
	function viewAtt(index) {
		var row = $('#pro_table').datagrid('getRows')[index];
		var tb = "";
		$.each(row.attachments,function(i,val) {
			if(isImage(val.url)){
				tb+= '<img onclick="window.open(\'../'+val.url+ 
				'\',\'_blank\', \' toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no\');" '+
				'src="../'+val.url+'" style="width:100px;"><br><span>'+val.name+'</span><br>';
			}else{
				tb+= '<a href="javascript:void(0)" onclick="attachmentFile('+val.id+',\''+val.name+
				'\')"><span>'+val.name+'</span></a><br>';
			}
		});
		$('#displayAtt').empty().html(tb);
		$('#displayAtt').dialog({
			title : '附件',
			resizable : true,
			closed : false,
			cache : false,
			modal : true
		});
	}
	function isImage(url) {
		var index= url.lastIndexOf(".");
		var ext = url.substr(index+1);
		return [ 'png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff' ,'ico'].
				indexOf(ext.toLowerCase()) !== -1;
	}
	function attachmentFile(id,name) {
		$.get('attachmentFile.do?id=' + id, function(data) {
			blob = new Blob([ data ])
			var a = document.createElement('a');
			a.download = name;
			a.href = window.URL.createObjectURL(blob)
			a.click()
		})
	}
	function remove(id) {
		$.messager.confirm("操作提示", "您确定要执行操作吗？", function(data) {
			if (data){
				$.ajax({
					type : 'POST',
					url : "attachmentDelete.do?id=" + id,
					contentType : "application/json",
					success : function(data) {
						if (data.success){
							$("#att" + id).remove();
							$.messager.show({
								title : '删除附件',
								msg : '删除附件成功',
								timeout : 5000,
								showType : 'slide'
							});
							refreshProTable();
						}else{
							$.messager.alert('删除附件', '删除附件失败', 'error');
						}
						$('#childDlg').dialog('close');
					},
					dataType : "json"
				});
			}
		});
	}
	function formatDate(time) {
		var date = new Date(time);
		var year = date.getFullYear();
		var month = date.getMonth() + 1; //月份是从0开始的
		if (month < 10){
			month = "0" + month;
		}
		var day = date.getDate();
		if (day < 10){
			day = "0" + day;
		}
		var hour = date.getHours();
		if (hour < 10){
			hour = "0" + hour;
		}
		var min = date.getMinutes();
		if (min < 10){
			min = "0" + min;
		}
		var sec = date.getSeconds();
		if (sec < 10){
			sec = "0" + sec;
		}
		var newTime = year + '-' + month + '-' + day + ' ' + hour + ':' + min + ':' + sec;
		return newTime;
	}
	function parsedate(value) {
		var date = new Date(value);
		var year = date.getFullYear();
		var month = date.getMonth() + 1; //月份+1   
		var day = date.getDate();
		var hour = date.getHours();
		var minutes = date.getMinutes();
		var second = date.getSeconds();
		return day + "/" + month + "/" + year + " " + hour + ":" + minutes + ":" + second;
	}
</script>
</html>